<template>
  <page-detail>
    <div class="ne-container">
      <ne-tabs :tabs="tabs1" style="margin-bottom: 14px" @change="statusChange" />
      <ne-tabs :tabs="tabs" mode="button" style="margin-bottom: 14px" @change="tabChange" />
      <bring-card v-for="item in dataSource" :key="item.indexCode" :row="item"
        :is-sign="!(item.itemStatus === '1' && queryType === '1')" @success="queryList()" />
      <van-empty v-if="!dataSource.length" description="暂无数据" />
    </div>
    <template #footer>
      <van-button type="primary" round style="width: 200px"
        v-if="userInfo.userRole.includes('1') || userInfo.userRole.includes('2') || userInfo.userRole.includes('3') || userInfo.userRole.includes('5')"
        @click="$toPage('/pages/djzh/activitySubmit')">发起活动</van-button>
    </template>
  </page-detail>
</template>

<script>
import NeTabs from "../../components/NeTabs.vue";
import BringCard from "./components/BringCard.vue";
import { mapGetters } from "vuex";
import pagingMixin from "../../mixins/pagingMixin";
export default {
  name: 'wx_pages_djzh_massPage',
  components: { NeTabs, BringCard },
  mixins: [pagingMixin],
  data() {
    return {
      restfulApi: '/tbMoralEducation/page',
      educationList: [],
      itemStatus: '0',
      queryType: '',
      tabs1: [
        {
          name: '全部活动',
          value: ''
        },
        {
          name: '我已报名',
          value: '1'
        },
        {
          name: '我发起的',
          value: '2'
        }
      ],
      tabs: [
        {
          name: '待开始',
          value: '0'
        },
        {
          name: '进行中',
          value: '1'
        },
        {
          name: '已结束',
          value: '2'
        }
      ]
    }
  },
  computed: {
    ...mapGetters(['userInfo']),
  },
  methods: {
    queryList() {
      let formData = {
        itemType: '2',
        itemStatus: this.itemStatus,
        queryType: this.queryType,
        approvalStatus: '1'
      }
      if (this.queryType) {
        formData.currentUserId = this.userInfo.userId
      }
      this.search(formData)
    },
    tabChange(index) {
      this.itemStatus = this.tabs[index].value
      this.queryList()
    },
    statusChange(index) {
      this.queryType = this.tabs1[index].value
      this.queryList()
    }
  },
  onLoad() {
    this.queryList()
  }
}
</script>
